<!DOCTYPE HTML>
<html>
	<head>
		<meta charset="utf-8">
		<meta name="viewport" content="maximum-scale=1.0,minimum-scale=1.0,user-scalable=0,width=device-width,initial-scale=1.0"/>
		<meta name="format-detection" content="telephone=no,email=no,date=no,address=no">
		<title></title>
		<link rel="stylesheet" type="text/css" href="../../css/aui/aui.css" />
		<style type="text/css">
			body {
				background: #efeff4;
			}
			.my-header {
				background: url('../../image/bg.jpg') no-repeat;
				background-size: cover;
				min-height: 250px;
				position: relative;
			}
			.my-info {
				position: relative;
				padding: 60px 0 0 0;
				width: 100%;
				bottom: 0;
				text-align: center;
				vertical-align: center;
			}
			.my-info img {
				width: 80px;
				height: 80px;
				border-radius: 50%;
			}
			.my-info p.nickname {
				margin-top: 5px;
				color: #ffffff;
				font-size: 18px;
			}
			.my-menu {
				position: absolute;
				width: 100%;
				height: 45px;
				line-height: 45px;
				left: 0;
				bottom: 0;
				text-align: center;
				background: #ffffff;
				filter: Alpha(opacity=50);
				background: rgba(255, 255, 255, 0.2) none repeat scroll 0 0 !important;
				color: #ffffff;
				font-size: 14px;
			}
			.my-menu .aui-col-xs-3 {
				border-right: 1px solid #9bd6d5;
			}
			.my-menu .aui-col-xs-3:last-child {
				border-right: none;
			}
			.my-menu > div:active {
				background: #ffffff;
				filter: Alpha(opacity=50);
				background: rgba(255, 255, 255, 0.2) none repeat scroll 0 0 !important;
			}
			.aui-list-view-cell {
				line-height: 26px;
			}
			.aui-switch:checked {
				background: #4385f6 !important;
				border-color: #4385f6 !important;
				box-shadow: #4385f6 0 0 0 26px inset !important;
			}
		</style>
	</head>
	<body>
		<div class="aui-content my-header header display-none" id='setting-header'>
			<div class="my-info">
				<img src="../../image/pic.jpg">
				<p class="nickname">
					点点例官方
				</p>
			</div>
			<div class="my-menu">
				<div class="aui-col-xs-3" tapmode >
					首页
				</div>
				<div class="aui-col-xs-3" tapmode >
					动态
				</div>
				<div class="aui-col-xs-3" tapmode >
					关注
				</div>
				<div class="aui-col-xs-3" tapmode >
					设置
				</div>
			</div>
		</div>
		<div class="aui-content">
			<ul class="aui-list-view">
				<li class="aui-list-view-cell" tapmode >
					<a class="aui-arrow-right">个人资料 </a>
				</li>
				<li class="aui-list-view-cell" tapmode >
					<a class="aui-arrow-right">账号设置</a>
				</li>
				<li class="aui-list-view-cell" tapmode >
					<a class="aui-arrow-right">我的订单</a>
				</li>
				<li class="aui-list-view-cell" tapmode >
					<a class="aui-arrow-right">我的相册</a>
				</li>
			</ul>
		</div>
		<div class="aui-content">
			<ul class="aui-list-view">
				<li class="aui-list-view-cell" tapmode >
					<a class="aui-arrow-right">系统设置</a>
				</li>
				<li class="aui-list-view-cell" tapmode >
					<a class="aui-arrow-right">检查更新</a>
				</li>
				<li class="aui-list-view-cell" tapmode >
					<a class="aui-arrow-right"> 清除缓存 <span class="aui-badge aui-badge-danger">36M</span> </a>
				</li>
				<li class="aui-list-view-cell" tapmode >
					<a class="aui-arrow-right">使用帮助</a>
				</li>
			</ul>
		</div>
		<div class="aui-content">
			<ul class="aui-list-view">
				<li class="aui-list-view-cell aui-switch-body" tapmode >
					<div class="aui-switch-title">
						声音提醒
					</div>
					<input type="checkbox" class="aui-switch aui-pull-right" checked>
				</li>
				<li class="aui-list-view-cell aui-switch-body" tapmode >
					<div class="aui-switch-title">
						自动更新
					</div>
					<input type="checkbox" class="aui-switch aui-pull-right">
				</li>
			</ul>
		</div>
	</body>
	<script type="text/javascript" src="../../script/AHelper.js"></script>
	<script type="text/javascript" src="../../script/zepto.min.js"></script>
	<script type="text/javascript">
		var param = {};
		window.onscroll = function() {
			var t = document.documentElement.scrollTop || document.body.scrollTop;
			if (param.paddingTop) {
				if (t > param.paddingTop + 30) {
					H.$execScript(null, 'setting_head', 'setFade(true);');
				} else {
					H.$execScript(null, 'setting_head', 'setFade(false);');
				}
			}
		}
		H.ready(function() {
			param = H.$getPageParam();
		});
	</script>
</html>